Components

Class: BarChart

BarChart(height, width, timeSelected, tweetData, timestepSelected) → {JSX.Element}

new BarChart(height, width, timeSelected, tweetData, timestepSelected) → {JSX.Element}

BarChart creates the barchart displaying the amount of tweets within the chosen interval at the chosen time
Parameters:
Name Type Description
height
width
timeSelected
tweetData
timestepSelected
Author:
  • Hannah Bayat
Source:
  • BarChart.js, line 15
Returns:
Type
JSX.Element

Class: PieChart

PieChart(width, height, tweetData, sentimentSelected) → {JSX.Element}

new PieChart(width, height, tweetData, sentimentSelected) → {JSX.Element}

PieChart creates the Piechart component with the specified width and height. When the tweetData gets updated it changes its data and looks. Outputs the selected sentiment that is passed on to the other components.
Parameters:
Name Type Description
width
height
tweetData
sentimentSelected
Author:
  • Hannah Bayat
Source:
  • PieChart.js, line 18
Returns:
Type
JSX.Element

Methods

(inner) setupContainersOnMount()

setupContainersonMount is called once to set up the initial parts of the piechart
Author:
  • Hannah Bayat
Source:
  • PieChart.js, line 96

(inner) drawPieChart()

drawPieChart() uses enter() and exit() to redraw the piechart every time props change with transitions
Author:
  • Hannah Bayat
Source:
  • PieChart.js, line 119

(inner) addTextAtTop()

addTextAtTop() sets the text on top of the piechart (title)
Author:
  • Hannah Bayat
Source:
  • PieChart.js, line 187

(inner) addTextInCenter()

addTextInCenter() sets the text on top of the piechart (title)
Author:
  • Hannah Bayat
Source:
  • PieChart.js, line 208

Class: TimeSlider

TimeSlider(height, width, timeSelected, tweetData, timestepSelected) → {JSX.Element}

new TimeSlider(height, width, timeSelected, tweetData, timestepSelected) → {JSX.Element}

TimeSlider creates the timeslider component that lets the user choose the time they want to analyze outputs the selected time
Parameters:
Name Type Description
height
width
timeSelected
tweetData
timestepSelected
Author:
  • Hannah Bayat
Source:
  • TimeSlider.js, line 17
Returns:
Type
JSX.Element

(inner) dragged(value) → {function}

gets called every time the ball on the timeslider is being dragged to retrieve the time value chosen
Parameters:
Name Type Description
value
Author:
  • Hannah Bayat
Source:
  • TimeSlider.js, line 173

(inner) fetchData(timeSliderValue) → {function}

fetches the data from the total dataset for the chosen time and time-interval and sets the data (tweetData)
Parameters:
Name Type Description
timeSliderValue
Author:
  • Hannah Bayat
Source:
  • TimeSlider.js, line 201

Class: TimestepDropDown

TimestepDropDown(timestepSelected) → {JSX.Element}

new TimestepDropDown(timestepSelected) → {JSX.Element}

creates the dropdown for the user to choose the timestep (days, hours or minutes) and sets the variable timestepSelected
Parameters:
Name Type Description
timestepSelected
Author:
  • Hannah Bayat
Source:
  • TimestepDropDown.js, line 12
Returns:
Type
JSX.Element

Class: TweetView

TweetView(tweetData, sentimentSelected, tweetAmountShown, tagSelected) → {JSX.Element}

new TweetView(tweetData, sentimentSelected, tweetAmountShown, tagSelected) → {JSX.Element}

shows the chosen amount of tweets (in the dropdown) for a certain sentiment (sentimentSelected) in the piechart at a certain time selected in the timeslider
Parameters:
Name Type Description
tweetData
sentimentSelected
tweetAmountShown
tagSelected
Author:
  • Hannah Bayat
Source:
  • TweetView.js, line 15
Returns:
Type
JSX.Element

(inner) wrap(text, width) → {function}

puts linebreaks in the text for the tweets such that it looks like a tweet, adapted from https://bl.ocks.org/mbostock/7555321
Parameters:
Name Type Description
text
width
Author:
  • Hannah Bayat
Source:
  • TweetView.js, line 263

Class: TweetviewDropDown

TweetviewDropDown(tweetAmountShown) → {JSX.Element}

new TweetviewDropDown(tweetAmountShown) → {JSX.Element}

creates the dropdown for the user to choose the amount of tweets to be shown in the tweetview (10, 50 or 100) and sets the variable tweetAmountShown
Parameters:
Name Type Description
tweetAmountShown
Author:
  • Hannah Bayat
Source:
  • TweetviewDropDown.js, line 12
Returns:
Type
JSX.Element

Class: WordCloud

WordCloud(tweetData, sentimentSelected, sentimentTag) → {JSX.Element}

new WordCloud(tweetData, sentimentSelected, sentimentTag) → {JSX.Element}

Parameters:
Name Type Description
tweetData
sentimentSelected
sentimentTag
Source:
  • WordCloud.js, line 15
Returns:
Type
JSX.Element

Methods

(inner) dynamicSort(property) → {function}

This is a helper function to sort an array of objects by object property (ex. value: or count:)
Parameters:
Name Type Description
property
Source:
  • WordCloud.js, line 106
Returns:
Type
function

(inner) getCounts()

This function gets the unique keywords and their count from the keyword array It creates a dataArray used by the TagCloud
Source:
  • WordCloud.js, line 71

(inner) getSentKwordArr()

This builds an array of keywords for selected tweets
Source:
  • WordCloud.js, line 43

(inner) limitWords()

This function will make a new dataArray with a limited number of items (up to 'limit') This is necessary because there might be thousands of keywords in a selected time
Source:
  • WordCloud.js, line 125

Class: WorldMap

WorldMap(width, height, tweetData) → {JSX.Element}

new WorldMap(width, height, tweetData) → {JSX.Element}

creates the worldmap using d3 and topojson displays the amount of tweets per country with a linear gradient scale
Parameters:
Name Type Description
width
height
tweetData
Author:
  • Hannah Bayat
Source:
  • WorldMap.js, line 16
Returns:
Type
JSX.Element